<template>
  <div :class="['art-shop-introduction', $ua.isFromPc() ? 'z-web' : 'z-phone']">
    <div class="desc">
      {{ desc }}
    </div>
  </div>
</template>

<script>
export default {
  scrollToTop: true,
  name: 'showHall',
  props: ['desc'],
  data() {
    return {

    }
  },
  mounted() {},
  methods: {

  }
}
</script>

<style lang="less" scoped>
.art-shop-introduction {
  // padding-top: 30px;
  &.z-web {
    padding: 30px 274px 60px;
    background-color: #fff;
    .banner {
      width: 100%;
      height: 952px;
      object-fit: cover;
      margin-bottom: 30px;
    }

    .desc {
      font-size: 24px;
      font-weight: 600;
      color: #000;
      text-align: left;
    }
  }

  &.z-phone {
    padding: 0 pxtorem(25);

    .desc {
      font-size: pxtorem(24);
      font-weight: 600;
      color: #000;
      text-align: left;
    }
  }
}
</style>